<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@ taglib prefix="spring" uri="http://www.springframework.org/tags"%>
<%@ taglib prefix="form" uri="http://www.springframework.org/tags/form"%>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%>

<c:set var="context"
	value="${pageContext.request.servletContext.contextPath}" />
<script type="text/javascript">
	$(document).ready(function() {
		createDialogConfirm();
		createDialogAlert();
		createDialogOk();
		var assignmentId = $("#assignmentId").text();

	});

	$(document).on("click", "#update", function() {
		var assignmentId = $("#assignmentId").text();
		var listClass = ";";
		var checked = $("input:checkbox:checked");
		checked.each(function(index) {
			var tr = $(this).parents("tr");
			var id = tr.find("td:nth-child(2)");
			listClass += id.text() + ";";
		});
		//Send ajax to Controller
		$.ajax({
			url : assignmentId + '/update',
			type : "POST",
			dataType : 'text',
			contentType : 'application/json',
			mimeType : 'application/json',
			data : listClass,
			error : function(data, status, er) {
				alert("error: " + data + " status: " + status + " er:" + er);
			},
			success : function(data) {
				alert(data);
			}
		});
		return false;
	});

	$(document).on("click", "#delete", function() {
		try {
			$("#dialog-confirm").dialog("open");
		} catch (e) {
			alert(e);
		}
		return false;
	})

	function createDialogConfirm() {
		var assignmentId = $("#assignmentId").text();
		var assignmentName = $("#assignmentName").text();
		$("#dialog-confirm").dialog({
			autoOpen : false,
			resizable : false,
			modal : true,
			buttons : {
				"Delete" : function() {
					$.ajax({
						url : "../delete/" + assignmentId,
						type : "GET",
						error : function() {
							$("#dialog-alert").dialog("open");
						},
						success : function(data) {
							$("#dialog-ok").dialog("open");
							//Return to list page
							window.location.href = "../";
						}
					})
					$(this).dialog("close");
				},
				Cancel : function() {
					$(this).dialog("close");
				}
			}
		});
	};
	function createDialogAlert() {
		$("#dialog-alert").dialog({
			autoOpen : false,
			resizable : false,
			modal : true,
			buttons : {
				OK : function() {
					$(this).dialog("close");
				}
			}
		});
	};

	function createDialogOk() {
		$("#dialog-ok").dialog({
			autoOpen : false,
			resizable : false,
			modal : true,
			buttons : {
				OK : function() {
					$(this).dialog("close");
				}
			}
		});
	};
</script>
<div id="dialog-confirm" title="Delete Confirm">
	<p>
		<span class="ui-icon ui-icon-alert"
			style="float: left; margin: 0 7px 20px 0;"></span>Do you want to
		delete ${test.testAndQuizzName}?
	</p>
</div>

<div id="dialog-alert" title="Delete Alert">
	<p>
		<span class="ui-icon ui-icon-alert"
			style="float: left; margin: 0 7px 20px 0;"></span> Can't delete
		${test.testAndQuizzName}!
	</p>
</div>
<div id="dialog-ok" title="Delete Success">
	<p>
		<span class="ui-icon ui-icon-alert"
			style="float: left; margin: 0 7px 20px 0;"></span>
		${test.testAndQuizzName} deleted!
	</p>
</div>

<!-- Template for all sub-pages -->
<div id="portal_main_content" align="left">
	<!-- Don't change this -->
	<div id="site_title">

		<!-- ************** -->
		<!-- Able to change -->
		<h2>Assignment: Grade</h2>
	</div>
	<!-- Don't change this -->
	<div id="site_content">
		<div id="btn_control">

			<!-- ************** -->
			<!-- Able to change -->

		</div>
		<div id="main_content">

			<!-- ************** -->
			<!-- Able to change -->
			<h6 class="hidden" id="assignmentId">${assignment.assignmentId}</h6>
			<h6 class="hidden" id="assignmentName">${assignment.assignmentName}</h6>
			<div>
				<fieldset class="input_table">
					<legend>${assignment.assignmentName}</legend>
					<div class="input_row">
						<div>
							<b>Name</b>
						</div>
						<div>${assignment.assignmentName}</div>
					</div>
					<div class="input_row">
						<div>
							<b>Start Time</b>
						</div>
						<div>
							<fmt:formatDate value="${assignment.startDay}"
								pattern="dd/MM/yyyy hh:mm:ss" />
						</div>
					</div>
					<div class="input_row">
						<div>
							<b>Due to</b>
						</div>
						<div>
							<fmt:formatDate value="${assignment.endDate}"
								pattern="dd/MM/yyyy hh:mm:ss" />
						</div>
					</div>
					<div class="input_row">
						<div>
							<b>Submit time</b>
						</div>
						<div>${assignment.timeSubmitAllow}</div>
					</div>
					<div class="input_row">
						<div>
							<b>Max Point</b>
						</div>
						<div>${assignment.maxPoint}</div>
					</div>
					<div class="input_row">
						<div>
							<b>Instruction</b>
						</div>
					</div>${assignment.description}<br> <b>Additional resource for
						assignment</b> <a href="../../../../../file/${file.fileId }"
						target="_blank">${file.fileName}</a>


					<hr>
					
					<form:form action="" modelAttribute="submittedAssignment"
						method="post" style="min-width: 240px;">
						<fieldset class="input_table">
							<legend>Submitted Assignment</legend>
							<div>
						<div class="input_row">
							<div>
								<b>Instruction</b>
							</div>
						</div>
							${submittedAssignment.description}<br>
						<b>Submitted Attachment</b>
						<a href="../../../../../file/${studentFile.fileId }"
							target="_blank">${studentFile.fileName}</a>
						</div>
						</fieldset>
						<div class="input_row">
							<div>Point</div>
							<div>
								<form:input path="point" placeholder="point"
									cssClass="form-control" />
							</div>
							<div>
								<form:errors path="point" cssClass="error" />
							</div>
						</div>

						<div class="input_row">
							<div></div>
							<div>
								<input type="submit" value="Grade" class="btn btn-primary" /> <a
									href="../test/" class="btn btn-primary">Cancel</a>
							</div>
							<div></div>
						</div>
					</form:form>
					

				</fieldset>
			</div>
		</div>


	</div>
</div>

